<template>
  <div class="col-xs-6 panel-body">
    <h2>我是Home的内容
        <input type="text">
    </h2>
    <div>
      <!-- 导航区 -->
      <ul class="nav nav-tabs">
        <li>
          <router-link to="/home/news">News</router-link>
        </li>
        <li>
          <router-link to="/home/message">Message</router-link>
        </li>
      </ul>
      <!-- 展示区 -->
      <div>
          <!-- 路由组件出口的地方,在哪里显示!!!以后在配置路由的时候，如果看不到路由组件  router-view书写了吗? -->
          <router-view></router-view>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "home",
};
</script>

<style scoped>
 .router-link-active{
   background:pink !important;
   color:white !important;
 }
</style>